/* Welcome to Compass.
 * In this file you should write your main styles. (or centralize your imports)
 * Import this file using the following HTML or equivalent:
 * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */

@import "compass/reset";
/*SECCION DE PRUEBAS.*/
/*----------------------.*/
/*En esta seccion declarar las variales.*/
/*Son del estilo $ (pesos) + NOMBRE:.*/
$colordePrueba: #f00;

/*En esta seccion declarar la funciones que inician etiquetas html.*/
/*Comienzan con @mixin nombreDeLaFuncion ($variable1, $variable2, ......, $variableN).*/
/*Tratar que el nombre de la funcion sea declarativo y ademas haga referencia.*/
/*a la etiqueta HTML que va a iniciar.*/
@mixin divEjemplofunction($tipo, $mt, $mr, $mb, $ml, $bc){
     position: $tipo;
     margin-top: $mt;
     margin-right: $mr;
     margin-bottom: $mb;
     margin-left: $ml;
     background-color:$bc;
}

/*En esta seccion declarar las etiquetas particulares.*/
/*Aca van a ir las etiquetas HTML particulares con sus.*/
/*valores personalizados que no sean inicializados en las funciones.*/
/*Para utilizar una funcion se hace @include nombreFuncion(valorVariable1,....,valorVariableN).*/
.header {
    @include divEjemplofunction(relative, 50px, 0px, 10px, 200px, #F4EAC3);
    width: 88%;
    height: 400px;
}

.footer {
    @include divEjemplofunction(fixed, -20px, 0px, 30px, 200px, #668284);
    z-index: 1;
    width: 97.5%;
    height: 60px;
}

div .prueba {
background-color: $colordePrueba;
}
/*SECCION ONLINE.*/
/*----------------------.*/
